{include file="public/header" /}
<div class="index_html houtai">
    {include file="public/second_header" /}


    <!-- 地下内容的开始 -->
    <div class="backgroud_content">
        <!-- 左侧的开始 -->
        {include file="public/nav" /}
        <!-- 左侧的结束 -->
        <form action="" class="horizontal" method="post" role="form" >
            <!-- 右侧的开始 -->
            <div class="right_bar jianchajilu  zhanghaoguanli add_juese">
                {include file="public/go_back" /}
                <div class="jcjl_detail">
                    <div class="top_dec">
                        <div>
                            <span class="theme">权限设置</span>
                        </div>
                    </div>
                    <div class="data">
                        <div class="center">
                            <div class="option">

                                <div class="floors">
                                    <!---------------------------------floors--------------------------->
                                    {foreach name="rule_data" item="v" }
                                    <div class="floor">
                                        <div class="left">

                                            <input type="checkbox" name="rule_ids[]" value="{$v['id']}" {if  condition="in_array($v['id'],$group_data)"}	checked="checked"{/if}  >

                                            <span>{$v['menuname']}</span>
                                        </div>
                                        {foreach name="v['_data']" item="n" key="k"}
                                        <div class="mid">
                                            <div class="mid_1">

                                                <!---------------------------------二级目录--------------------------->
                                                <div class="mid_1_center">
                                                    <input type="checkbox" name="rule_ids[]" value="{$n['id']}" {if  condition="in_array($n['id'],$group_data)"}	checked="checked"{/if} >

                                                    <span>{$n['menuname']}</span>
                                                </div>
                                                <!---------------------------------二级目录--------------------------->

                                                <div class="mid_1_right">
                                                    {volist name="n['_data']" id="c"}
                                                    <!---------------------------------三级目录--------------------------->
                                                    <div>
                                                        <input type="checkbox" name="rule_ids[]" value="{$c['id']}" {if  condition="in_array($c['id'],$group_data)"}	checked="checked"{/if}>
                                                        <span>{$c['menuname']}</span>
                                                    </div>
                                                    {/volist}

                                                    <!---------------------------------三级目录--------------------------->
                                                </div>
                                            </div>
                                        </div>

                                        {/foreach}

                                    </div>
                                    <!-- floor 结束 -->
                                    {/foreach}
                                    <!---------------------------------floors--------------------------->

                                </div>

                            </div>
                        </div>
                        <div class="save_or_no">
                            <a  class="cirtain">
                                <input type="button" class="ajax-post" value="确定">
                            </a>
                            <a href="">
                                取消
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 右侧的结束 -->
        </form>
    </div>
</div>
{include file="public/footer" /}
<script>
    $(function(){
        /*点击第一·个的事件*/
        // var level_1_input =  $(".backgroud_content .add_juese .floor>div.left input");
        $(document).on("click",".backgroud_content .add_juese .floor>div.left input",function(){
            // console.log(this);
            if(this.checked){
                console.log("第1 选中");
                var level_1_2_input = $(this).parent().parent().find(" input");
                // console.log(level_1_2_input);
                level_1_2_input.attr("checked","checked");
            }else{
                console.log("第1 未选中");
                var level_1_2_input = $(this).parent().parent().find(" input");
                // console.log(level_1_2_input);
                level_1_2_input.removeAttr("checked","checked");
            }
        });

        /*点击第二个的事件*/
        $(document).on("click",".backgroud_content .add_juese div.mid_1_center input",function(){
            console.log(this);
            var level_1_input = $(this).parent().parent().parent().parent().find(".left");
            // console.log(level_1_input);

            var level_2_input =  $(this).parent().parent();
            var level_2_input_index =  $(this).parent().parent().index();
            // console.log(level_2_input);
            console.log("点击的 是 中间的  第"+level_2_input_index);

            if(this.checked){
                console.log("第2 列有 选中");
                // 控制右面的 选中
                // 选中的  对应的    右面的 也全部选中
                var level_3_input = $(this).parent().parent().parent().find(".mid_1_right");//获取 最右面对应的 第几个盒子
                // console.log(level_3_input);
                level_3_input.eq(level_2_input_index).find("input").attr("checked","checked");


                // 控制 最左面的 取消选中
                $(level_1_input).find("input").attr("checked","checked");

            }else{
                // console.log("第2 未选中");

                // console.log(level_2_input_index);
                // 取消的  对应的    右面的 也全部取消选中
                var level_3_input = $(this).parent().parent().find(".mid_1_right");//获取 最右面对应的 第几个盒子
                console.log(level_3_input,222);
                level_3_input.find("input").removeAttr("checked","checked");
            }
        });
        /*点击第三个的事件*/
        // var level_1_input =  $(".backgroud_content .add_juese .floor>div.left input");
        $(document).on("click",".backgroud_content .add_juese .floor>div.f_right_2 input",function(){
            // console.log(this);
            var level_3_input =  $(this).parent().parent();
            var level_3_input_index =  $(this).parent().parent().index();
            console.log(level_3_input_index);
            // console.log(level_3_input);
            if(this.checked){
                // 获取 第二个 的  盒子
                var level_2_input =  $(this).parent().parent().parent().parent().find(".mid>div");
                // 对应的   点击第三个获取到对应的 上级（第二级）
                var level_2_input_index  = level_2_input.eq(level_3_input_index);
                console.log(level_2_input_index);
                $(level_2_input_index).find("input").attr("checked","checked");

                // 点击第三个  对应的   第一个 选中状态
                var level_1_input = $(this).parent().parent().parent().parent().find(".left");
                $(level_1_input).find("input").attr("checked","checked");

            }
        });
    })
</script>
<script>
    $(function(){
        var right_length= $(".backgroud_content .add_juese .option .floors .floor>div.mid>div>div.mid_1_right");
        // console.log(right_length.length);
        for(var i =0;i<right_length.length;i++){
            // console.log(i);
            var limiang_div = right_length.eq(i).find(">div");
            if(limiang_div.length == 1){
                limiang_div.css({"background":"url(__STATIC__/index/imgs/back_center.png) left center no-repeat"})
            }
        }
        var mid_1_center= $(".floor>div.mid");
        // console.log(mid_1_center);
        // console.log(mid_1_center.length);
        for(var i =0;i<mid_1_center.length;i++){
            // console.log(i);
            var center_div = mid_1_center.eq(i).find(">div");
            // console.log(center_div);
            if(center_div.length == 1){
                center_div.css({"background":"url(__STATIC__/index/imgs/back_center.png) left center no-repeat"})
            }
        }

    })
</script>